{% extends "base.html" %}
{% block title %}学分绩点{% endblock %}

{% block content %}
<div class="row main">
  <div class="span8">
    <div class="well well-small">
      <form class="form-inline" style="margin-bottom:0">
        <div class="input-prepend">
          <span class="add-on">学年</span>
          <select class="span2" name="year" id="year">
            <option>2005-2006</option>
            <option>2006-2007</option>
            <option>2007-2008</option>
            <option>2008-2009</option>
            <option>2009-2010</option>
            <option>2010-2011</option>
            <option>2011-2012</option>
            <option selected="selected">2012-2013</option>
            <option>2013-2014</option>
            <option>2014-2015</option>
            <option>2015-2016</option>
          </select>
        </div>
        <div class="input-prepend btn-group">
          <div class="controls">
            <div class="term-btn-group btn-group active" data-toggle="buttons-radio">
              <button value="1" type="button" class="btn">第一学期</button>
              <button value="2" type="button" class="btn">第二学期</button>
              <button value="3" type="button" class="btn">第三学期</button>
            </div>
          </div>
        </div>
        <button type="submit" id="score-query-btn" class="btn btn-primary pull-right"><i class="icon-search icon-white"></i> 查询</button>
      </form>
        <div id="score-result">
      <table class="table table-condensed table-hover">

      </table>
    </div>

    </div>

    </div>
   <div class="span8">
          <div class="well well-small">
            <h5 style="margin-bottom:10px">学分总览</h5>
            <table id="credit-chart" class="table table-hover table-condensed">
            <thead>
              <tr><th>类型</th><td>绩点</td><td>学分</td><td></td><td>完成度</td></tr>
            </thead>
          </table>
          </div>
        </div>

{% if not g.is_handheld_device %}
        <div class="span8">
          <div class="well well-small">
          <h5>成绩分布与绩点换算</h5>
          <p><a rel="tooltip" class="label" title="(A)90-100=4.0-5.0<br>(B)80-89=3.0-3.9<br>(C)70-79=2.0-2.9<br>(D)60-69=1.0-1.9<br>(E)0-59=0">第一种</a>算法的GPA是: <span class="label" id="gpa_origin">0</span></p>
          <p><a rel="tooltip" class="label" title="(A)85-100=4.0<br>(B)80-84=3.5<br>(C)75-79=3.0<br>(D)70-74=2.5<br>(E)60-69=2.0<br>(F)0-59=1.0">第二种</a>算法的GPA是: <span class="label" id="gpa_new">0</span></p>
          <form class="form-inline" style="margin-bottom:0">

        <div class="input-prepend btn-group">
          <div class="controls">
            <div class="chart-type-btn-group btn-group active" data-toggle="buttons-radio">
              <button value="pie" type="button" class="btn">饼图</button>
              <button value="bar" type="button" class="btn">条形图</button>
            </div>
          </div>
        </div>
      </form>

          <div id="gpa-chart">

          </div>

          </div>
        </div>
      {% endif %}
</div>

<script type="text/javascript" src="/static/js/highcharts.js"></script>
{% endblock %}
{% block scripts %}
<script type="text/javascript" src="/static/js/score.js"></script>
{% endblock %}